﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>按照岗位选择</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="../../Scripts/jquery-1.11.0.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="../../Scripts/QueryString.js"></script>
    <script type="text/javascript" src="../../Scripts/config.js"></script>
    <script type="text/javascript" src="../../Comm/Gener.js"></script>

    <script src="../../Scripts/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <link href="../../Scripts/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="../../Scripts/bootstrap/css/font-awesome.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/bootstrap/bootstrap-table/src/bootstrap-table.js" type="text/javascript"></script>
    <link href="../../Scripts/bootstrap/bootstrap-table/src/bootstrap-table.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/bootstrap/bootstrap-table/src/locale/bootstrap-table-zh-CN.js" type="text/javascript"></script>

    <script src="../../Scripts/bootstrap/bootstrap-treeview/src/js/bootstrap-treeview.js" type="text/javascript"></script>
    <link href="../../Scripts/bootstrap/bootstrap-treeview/src/css/bootstrap-treeview.css" rel="stylesheet" type="text/css" />
    <style>
        ul li {
            list-style: none;
        }

        a, a:hover {
            text-decoration: none;
        }
    </style>
    <script type="text/javascript">

        var webUser = new WebUser();
        var workID = GetQueryString("WorkID");
        var toNodeID = GetQueryString("ToNode");
        var checkedEmps = null;
        //初始化人员
        $(function () {
            //初始化左列表
            var tps = new Entities("BP.Port.StationTypes");
            tps.RetrieveAll();

            var stas = new Entities("BP.Port.Stations");
            stas.RetrieveAll();

            var html = "<ul class='list-group'>";

            for (var idx = 0; idx < tps.length; idx++) {
                var tp = tps[idx];

                html += "<li ><b>" + tp.Name + "</b></li>";

                for (var i = 0; i < stas.length; i++) {
                    var sta = stas[i];
                    if (sta.FK_StationType != tp.No)
                        continue;

                    html += "<li class='list-group-item'><a href=\"javascript:ShowEmp('" + sta.No + "');\" id='" + sta.No + "' >" + sta.Name + "</a></li>";
                }
            }

            html += "</ul>";

            $("#stationsList").append(html);

            //初始化已选择的人员
            var emps = GetSelectedEmps();
            html = "";
            for (var i = 0; i < emps.length; i++) {
                var en = emps[i];
                html += "<tr id='" + en.FK_Emp + "' data-uniqueid='" + en.FK_Emp + "'>"
                html += "<td class='bs-checkbox ' >" + en.FK_Emp + "</td>";
                html += "<td>" + en.EmpName + "</td>";
                html += "<td><a class='newBtn btn-danger' href='#' onclick=removeRecord('" + en.FK_Emp + "','" + en.EmpName + "')>X</a></td>";
                html += "</tr>"

            }
            $("#selectEmpList").append(html);
            document.getElementById("EmpSelectAll").checked = false;
            var tip = "输入关键字."; // mapExt.GetPara("SearchTip");
            $("#TB_Key").attr("placeholder", tip); //设置查询提示.

            // search
            $("#TB_Key").on("keyup", function () {
                loadSelectGridByKey($(this).val());
            });
        });
        //按照关键字加载数据.
        function loadSelectGridByKey(key) {

            if (key == "")
                return;
            $(".emplist").remove();
            var hander = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt_Selecter");
            hander.AddUrlData();
            hander.AddPara("Key", key.replace(/'/g, ''));
            hander.AddPara("EnsOfM", "BP.Port.Emps");
            var json = hander.DoMethodReturnJSON("Selecter_SearchByKey");
            html = "";
            for (var i = 0; i < json.length; i++) {
                var en = json[i];
                html += "<tr class='emplist' data-index='" + i + "' data-uniqueid='" + en.No + "' >"
                html += "<td class='bs-checkbox ' ><input class='Empcheck' onchange=SelectEmp('" + en.No + "') name='" + en.No + "' id='" + en.Name + "' type='checkbox'></td>";
                html += "<td>" + en.No + "</td>";
                html += "<td>" + en.Name + "</td>";
                html += "<td>" + en.FK_DeptText + "</td>";
                html += "</tr>";
            }

            $("#stationsEmpList").append(html);
            //加载后设置已存在数据库中人员的Checked的状态
            SetChecked();
        }
        //显示人员.
        function ShowEmp(StationNo) {
            //选择其他岗位时清空人员列表
            $(".emplist").remove();
            //后台加载当前选中部门的人员列表
            var handler = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt_Selecter");
            handler.AddPara("StaNo", StationNo);
            var data = handler.DoMethodReturnString("ByStation_ShowEmps");
            var emps = eval('(' + data + ')');
            var html = "";

            for (var i = 0; i < emps.length; i++) {
                var en = emps[i];
                var DeptName = new Entity("BP.Port.Dept", en.FK_Dept);
                html += "<tr class='emplist' data-index='" + i + "' data-uniqueid='" + en.No + "' >"
                html += "<td class='bs-checkbox ' ><input class='Empcheck' onchange=SelectEmp('" + en.No + "') name='" + en.No + "' id='" + en.Name + "' type='checkbox'></td>";
                html += "<td>" + en.No + "</td>";
                html += "<td>" + en.Name + "</td>";
                html += "<td>" + DeptName.Name + "</td>";
                html += "</tr>";
            }

            $("#stationsEmpList").append(html);
            //加载后设置已存在数据库中人员的Checked的状态
            SetChecked();
        }
        //设置已存在数据库中人员的Checked的状态
        function SetChecked() {
            var emps = GetSelectedEmps();
            for (var i = 0; i < emps.length; i++) {
                var en = emps[i];
                if (document.getElementById(en.EmpName) != null)
                    document.getElementById(en.EmpName).checked = true;
                else
                    continue;
            }
        }
        //选择人员
        function SelectEmp(EmpNo) {

            //根据人员编号添加
            var en = new Entity("BP.Port.Emp", EmpNo);

            if (document.getElementById(en.Name).checked) {
                //添加到数据库
                AddDataOfSelectAccper(en);
                var html = "";
                html += "<tr id='" + en.No + "' data-uniqueid='" + en.No + "'>"
                html += "<td class='bs-checkbox ' >" + en.No + "</td>";
                html += "<td>" + en.Name + "</td>";
                html += "<td><a class='newBtn btn-danger' href='#' onclick=removeRecord('" + en.No + "','" + en.Name + "')>X</a></td>";
                html += "</tr>"

                $("#selectEmpList").append(html);
            }
            else {

                removeRecord(en.No, en.Name);
                document.getElementById(en.No).remove();
            }
        }
        //数据库增加选择的人员
        function AddDataOfSelectAccper(en) {
            var handler = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt_Selecter");
            handler.AddPara("FK_Node", toNodeID);
            handler.AddPara("WorkID", workID);
            handler.AddPara("FK_Emp", en.No);
            handler.AddPara("EmpName", en.Name);
            handler.AddPara("FK_Dept", en.FK_Dept);
            var data = handler.DoMethodReturnString("AddSelectEmp");
            if (data.indexOf('err@') == 0) { //如果有错误.
                alert(data);
                return;
            }
        }
        //删除按钮
        function removeRecord(No, Name) {
            if (window.confirm('您确认要删除吗？') == false) {

                document.getElementById(Name).checked = true;
                return;
            }
            var MyPK = toNodeID + "_" + workID + "_" + No;
            //删除选中的人员
            var handler = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt_Selecter");
            handler.AddPara("MyPK", MyPK);
            var data = handler.DoMethodReturnString("DelSelectEmp");
            if (data.indexOf('err@') == 0) { //如果有错误.
                alert(data);
                return;
            }
            alert(data);
            //删除后刷新当前页面
            location.reload(true);
        }
        //全选
        function SelectAll() {
            var inputs = document.getElementsByClassName("Empcheck");//获取name
            var inputAll = document.getElementById("EmpSelectAll");
            if (inputs.length == 0) {
                alert("人员列表为空！");
                inputs.checked = false;
                return;
            }
            if (inputAll.checked) {
                for (var i = 0; i < inputs.length; i++) {
                    if (inputs[i].checked)
                        continue;
                    inputs[i].checked = true;
                    SelectEmp(inputs[i].name);
                }
            }
            else {
                for (var i = 0; i < inputs.length; i++) {
                    if (inputs[i].checked= false)
                        continue;
                    inputs[i].checked = false;
                    removeRecord(inputs[i].name, inputs[i].id);
                }
            }
        }
        //得到选中的人员
        function GetSelectedEmps() {
            var emps = new Entities("BP.WF.Template.SelectAccpers");
            emps.Retrieve("WorkID", workID);
            return emps;
        }

        function GotoUrl(url) {
            var urlSuffix = "?WorkID=" + workID + "&ToNode=" + toNodeID;
            url += urlSuffix;
            window.location.href = url;
        }
    </script>

</head>
<body>
    <div class="container-fluid">
        <br />
        <div class="row">
            <div class="col-md-12">
                <div class="row">
                    <div class="col-md-3 col-sm-3">
                        <h4 class="text-center" id="title">关键字查询</h4>
                    </div>
                    <div class="col-md-9 col-sm-9">
                        <div class="pull-center search search-margin">
                            <input class="form-control" type="text" placeholder="" id="TB_Key">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--左列-->
        <div class="row row-margin-top">
            <div class="col-md-4 col-sm-4" style="height:500px">
                <div id="stationsList" style="overflow-y:auto;height:100%">
                    <table style="width:100%" class="table table-bordered">
                        <tr>
                            <td style="cursor:pointer;text-align:center" onclick="GotoUrl('ByStation.htm')"><a>按岗位</a></td>
                            <td style="cursor:pointer;text-align:center" onclick="GotoUrl('ByTeam.htm')"><a>按用户组</a></td>
                        </tr>
                    </table>
                </div>
            </div>

            <div class="col-md-8 col-sm-8">
                <div class="row" style="height:200px;">
                    <div class="col-md-12">
                        <table style="width: 976px;" class="table table-bordered table-hover" id="stationsEmpList">
                            <tr>
                                <th class="bs-checkbox " style="width: 36px; " data-field="_checkbox">
                                    <input onclick="SelectAll()" id="EmpSelectAll" type="checkbox">
                                </th>
                                <th style="" data-field="No">编号</th>
                                <th style="" data-field="Name">名称</th>
                                <th style="" data-field="DeptName">部门名称</th>
                            </tr>

                        </table>

                    </div>
                </div>
                <div class="row row-margin-top">
                    <div class="col-md-12">
                        <table id="selectEmpList" style="width: 976px;" class="table table-bordered table-hover">
                            <tr>
                                <th style="" data-field="No">编号</th>
                                <th style="" data-field="Name">名称</th>
                                <th style="" data-field="2">操作</th>
                            </tr>

                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

</body>
</html>
